define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'adminlte', 'template', 'webuploader'], function ($, undefined, Backend, Table, Form, Adminlte, Template, WebUploader) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'face/classes/index',
                }
            });

            var table = $("#table");
            var layer_loading = null;

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                sortName: 'id',
                columns: [
                    [
                        {field: 'state', checkbox: true, },
                        {
                            field: 'grade_id', title: __('Grade'), searchList: function (column) {
                                return Template('gradeTpl', {});
                            }, formatter: function (value, row, index) {
                                return '无';
                            }, visible: false
                        },
                        {field: 'name', title: __('Name'), operate: false},
                        {field: 'grade.name', title: __('Grade'), operate: false},
                        {field: 'school.name', title: __('School'), operate: false},
                        {field: 'garden.name', title: __('Garden'), operate: false},
                        {field: 'building.name', title: __('Building'), operate: false},
                        {field: 'classroom.name', title: __('Classroom'), operate: false},
                        {field: 'student_count', title: __('Student Count'), operate: false, formatter: Controller.api.formatter.student_count},
                        {
                            field: 'created_at',
                            title: __('Create time'),
                            sortable: true,
                            formatter: Table.api.formatter.datetime,
                            operate: 'RANGE',
                            addclass: 'datetimerange'
                        },
                        // {
                        //     field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons: [
                        //         {
                        //             name: 'sync',
                        //             title: '同步到班牌',
                        //             text: '同步到班牌',
                        //             icon: 'fa fa-paper-plane',
                        //             classname: 'btn btn-success btn-xs btn-click',
                        //             click: function (e, data) {
                        //                 if (data.device_key) {
                        //                     send('{"type":"publish","action":"sync","content":{"events":"pull_faces","class_id":"' + data.id + '","from":"'+Config.admin.socket_id+'"},"to":"'+data.device_key+'"}');
                        //                     layer_loading = Layer.load(1, {
                        //                         shade: [0.1,'#000'] //0.1透明度的白色背景
                        //                     });
                        //                 } else {
                        //                     Backend.api.toastr.error('该班级暂未绑定班牌！');
                        //                 }
                        //             }
                        //         }
                        //     ], formatter: Table.api.formatter.operate
                        // }
                    ]
                ],
                commonSearch: true,
                searchFormVisible: true,
            });

            // 为表格绑定事件
            Table.api.bindevent(table);

            $(document).on('click', '.btn-import', function () {
                Backend.api.open('face/classes/import', '导入', {area:['80%','80%']});
            });

            $(document).on('click', '.student', function () {
                Backend.api.open('face/classes/students?ids=' + $(this).data('id'), '详细信息', {area:['70%','70%']});
            });

            // 监听下拉列表改变的事件
            $(document).on('change', 'select[name=school_id]', function () {
                $("#school_id").val($(this).val());
            });

            // 证书是会检查域名的，请使用域名连接
            // ws = new WebSocket("wss://socket.uxuj.cn:4333/wss");
            // //登录
            // ws.onopen = function() {
            //     ws.send('{"type":"login","uid":"'+Config.admin.socket_id+'"}');
            // };
            // //监听
            // ws.onmessage = function(e) {
            //     var data = JSON.parse(e.data);
            //     if (data.type == 'publish') {
            //
            //         if (layer_loading != null) {
            //             Layer.close(layer_loading);
            //         }
            //
            //         if (data.code == 0) {
            //             Backend.api.toastr.error('同步失败！');
            //         } else {
            //             if (data.content.events && data.content.events == 'pull_faces_done') {
            //                 Backend.api.toastr.success('同步成功！');
            //             }
            //         }
            //     }
            // };
            // //心跳
            // setInterval(function () {
            //     ws.send('{"type":"ping"}');
            // }, 5000)
            // //发送
            // $('.send').click(function () {
            //     ws.send('{"type":"publish","to":"1001","content":"test"}');
            // })
            // //发送
            // function send(data) {
            //     console.log(data)
            //     ws.send(data);
            // }

        },
        add: function () {
            Controller.api.bindevent();
        },
        edit: function () {
            Controller.api.bindevent();
        },
        students: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'student/index',
                }
            });

            var table = $("#table");

            Template.helper("Moment", Moment);

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url + '?class_id=' + Config.admin.class_id,
                templateView: true,
                columns: [
                    [
                        {field: 'number', title: __('Number'),  operate: 'LIKE %...%',},
                        {field: 'avatar', title: __('Avatar'), operate: false},
                        {field: 'name', title: __('Name'), operate: 'LIKE %...%',},
                        {field: 'gender_text', title: __('Gender'), operate: false},
                    ],
                ],
                //禁用默认搜索
                search: false,
                //启用普通表单搜索
                commonSearch: false,
                //可以控制是否默认显示搜索单表,false则隐藏,默认为false
                searchFormVisible: false,
                //分页大小
                pageSize: 12,
                showToggle: false,
                showColumns: false,
                showExport: false,
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
        },
        import: function () {

            var class_id = 1;
            $('.classes').change(function () {
                class_id = $(this).val();

                $('#uploader').html(Template('tpl'));
                Controller.api.init(class_id);
            })

            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            },
            formatter: {
                student_count: function (value, row, index) {
                    return '<a class="student" data-id="'+row.id+'" href="javascript:void(0)" >' + value + '人</a>';
                }
            },
            init: function (class_id) {
                $('#container').show();
                var $wrap = $('#uploader'),

                    // 图片容器
                    $queue = $( '<ul class="filelist"></ul>' )
                        .appendTo( $wrap.find( '.queueList' ) ),

                    // 状态栏，包括进度和控制按钮
                    $statusBar = $wrap.find( '.statusBar' ),

                    // 文件总体选择信息。
                    $info = $statusBar.find( '.info' ),

                    // 上传按钮
                    $upload = $wrap.find( '.uploadBtn' ),

                    // 没选择文件之前的内容。
                    $placeHolder = $wrap.find( '.placeholder' ),

                    $progress = $statusBar.find( '.progress' ).hide(),

                    // 添加的文件数量
                    fileCount = 0,

                    // 添加的文件总大小
                    fileSize = 0,

                    // 优化retina, 在retina下这个值是2
                    ratio = window.devicePixelRatio || 1,

                    // 缩略图大小
                    thumbnailWidth = 110 * ratio,
                    thumbnailHeight = 110 * ratio,

                    // 可能有pedding, ready, uploading, confirm, done.
                    state = 'pedding',

                    // 所有文件的进度信息，key为file id
                    percentages = {},
                    // 判断浏览器是否支持图片的base64
                    isSupportBase64 = ( function() {
                        var data = new Image();
                        var support = true;
                        data.onload = data.onerror = function() {
                            if( this.width != 1 || this.height != 1 ) {
                                support = false;
                            }
                        }
                        data.src = "";
                        return support;
                    } )(),

                    // 检测是否已经安装flash，检测flash的版本
                    flashVersion = ( function() {
                        var version;

                        try {
                            version = navigator.plugins[ 'Shockwave Flash' ];
                            version = version.description;
                        } catch ( ex ) {
                            try {
                                version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash')
                                    .GetVariable('$version');
                            } catch ( ex2 ) {
                                version = '0.0';
                            }
                        }
                        version = version.match( /\d+/g );
                        return parseFloat( version[ 0 ] + '.' + version[ 1 ], 10 );
                    } )(),

                    supportTransition = (function(){
                        var s = document.createElement('p').style,
                            r = 'transition' in s ||
                                'WebkitTransition' in s ||
                                'MozTransition' in s ||
                                'msTransition' in s ||
                                'OTransition' in s;
                        s = null;
                        return r;
                    })(),

                    // WebUploader实例
                    uploader;

                if ( !WebUploader.Uploader.support('flash') && WebUploader.browser.ie ) {

                    // flash 安装了但是版本过低。
                    if (flashVersion) {
                        (function(container) {
                            window['expressinstallcallback'] = function( state ) {
                                switch(state) {
                                    case 'Download.Cancelled':
                                        alert('您取消了更新！')
                                        break;

                                    case 'Download.Failed':
                                        alert('安装失败')
                                        break;

                                    default:
                                        alert('安装已成功，请刷新！');
                                        break;
                                }
                                delete window['expressinstallcallback'];
                            };

                            var swf = './expressInstall.swf';
                            // insert flash object
                            var html = '<object type="application/' +
                                'x-shockwave-flash" data="' +  swf + '" ';

                            if (WebUploader.browser.ie) {
                                html += 'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" ';
                            }

                            html += 'width="100%" height="100%" style="outline:0">'  +
                                '<param name="movie" value="' + swf + '" />' +
                                '<param name="wmode" value="transparent" />' +
                                '<param name="allowscriptaccess" value="always" />' +
                                '</object>';

                            container.html(html);

                        })($wrap);

                    } else {
                        $wrap.html('<a href="http://www.adobe.com/go/getflashplayer" target="_blank" border="0"><img alt="get flash player" src="http://www.adobe.com/macromedia/style_guide/images/160x41_Get_Flash_Player.jpg" /></a>');
                    }

                    return;
                } else if (!WebUploader.Uploader.support()) {
                    alert( 'Web Uploader 不支持您的浏览器！');
                    return;
                }


                // 实例化
                uploader = WebUploader.create({
                    pick: {
                        id: '#filePicker',
                        label: '点击选择图片'
                    },
                    formData: {
                        uid: 123
                    },
                    dnd: '#dndArea',
                    paste: '#uploader',
                    chunked: false,
                    chunkSize: 512 * 1024,
                    accept: {
                        title: 'Image',
                        extensions: "tbi,jpg,png,gif"
                    },
                    swf: '/assets/img/uploader.swf',
                    server: "/admin/face/classes/upload?class_id=" + class_id,
                    fileVal: 'file',
                    disableGlobalDnd: true,// 禁掉全局的拖拽功能。这样不会出现图片拖进页面的时候，把图片打开。
                    fileNumLimit: 300,
                    fileSizeLimit: 200 * 1024 * 1024,    // 200 M
                    fileSingleSizeLimit: 100 * 1024 * 1024,    // 50 M
                    duplicate :true,//可重复上传
                });

                // 拖拽时不接受 js, txt 文件。
                uploader.on( 'dndAccept', function( items ) {
                    var denied = false,
                        len = items.length,
                        i = 0,
                        // 修改js类型
                        unAllowed = 'text/plain;application/javascript ';

                    for ( ; i < len; i++ ) {
                        // 如果在列表里面
                        if ( ~unAllowed.indexOf( items[ i ].type ) ) {
                            denied = true;
                            break;
                        }
                    }

                    return !denied;
                });

                uploader.on('dialogOpen', function() {
                    console.log('here');
                });

                // uploader.on('filesQueued', function() {
                //     uploader.sort(function( a, b ) {
                //         if ( a.name < b.name )
                //           return -1;
                //         if ( a.name > b.name )
                //           return 1;
                //         return 0;
                //     });
                // });

                // 添加“添加文件”的按钮，
                uploader.addButton({
                    id: '#filePicker2',
                    label: '继续添加'
                });

                uploader.on('ready', function() {
                    window.uploader = uploader;
                });

                // 当有文件添加进来时执行，负责view的创建
                function addFile( file ) {
                    var $li = $( '<li id="' + file.id + '">' +
                        '<p class="title">' + file.name + '</p>' +
                        '<p class="imgWrap"></p>'+
                        '<p class="progress"><span></span></p>' +
                        '</li>' ),

                        $btns = $('<div class="file-panel">' +
                            '<span class="cancel">删除</span>' +
                            '<span class="rotateRight">向右旋转</span>' +
                            '<span class="rotateLeft">向左旋转</span></div>').appendTo( $li ),
                        $prgress = $li.find('p.progress span'),
                        $wrap = $li.find( 'p.imgWrap' ),
                        $info = $('<p class="error"></p>'),

                        showError = function( code ) {
                            switch( code ) {
                                case 'exceed_size':
                                    text = '文件大小超出';
                                    break;

                                case 'interrupt':
                                    text = '上传暂停';
                                    break;

                                default:
                                    text = '上传失败，请重试';
                                    break;
                            }

                            $info.text( text ).appendTo( $li );
                        };

                    if ( file.getStatus() === 'invalid' ) {
                        showError( file.statusText );
                    } else {
                        // @todo lazyload
                        $wrap.text( '预览中' );

                        //待修改 .tbi不能预览可直接修改成.jpg Zhenzh
                        uploader.makeThumb( file, function( error, src ) {
                            var img;

                            if ( error ) {
                                $wrap.text( '不能预览' );
                                return;
                            }

                            if( isSupportBase64 ) {
                                img = $('<img src="'+src+'">');
                                $wrap.empty().append( img );
                            } else {
                                $.ajax('../../server/preview.php', {
                                    method: 'POST',
                                    data: src,
                                    dataType:'json'
                                }).done(function( response ) {
                                    if (response.result) {
                                        img = $('<img src="'+response.result+'">');
                                        $wrap.empty().append( img );
                                    } else {
                                        $wrap.text("预览出错");
                                    }
                                });
                            }
                        }, thumbnailWidth, thumbnailHeight );

                        percentages[ file.id ] = [ file.size, 0 ];
                        file.rotation = 0;
                    }

                    file.on('statuschange', function( cur, prev ) {

                        if ( prev === 'progress' ) {
                            $prgress.hide().width(0);
                        } else if ( prev === 'queued' ) {
                            $li.off( 'mouseenter mouseleave' );
                            $btns.remove();
                        }

                        // 成功
                        if ( cur === 'error' || cur === 'invalid' ) {
                            console.log( file.statusText );
                            showError( file.statusText );
                            percentages[ file.id ][ 1 ] = 1;
                        } else if ( cur === 'interrupt' ) {
                            showError( 'interrupt' );
                        } else if ( cur === 'queued' ) {
                            $info.remove();
                            $prgress.css('display', 'block');
                            percentages[ file.id ][ 1 ] = 0;
                        } else if ( cur === 'progress' ) {
                            $info.remove();
                            $prgress.css('display', 'block');
                        } else if ( cur === 'complete' ) {
                            $prgress.hide().width(0);
                            $li.append( '<span class="success"></span>' );
                        }

                        $li.removeClass( 'state-' + prev ).addClass( 'state-' + cur );
                    });

                    $li.on( 'mouseenter', function() {
                        $btns.stop().animate({height: 30});
                    });

                    $li.on( 'mouseleave', function() {
                        $btns.stop().animate({height: 0});
                    });

                    $btns.on( 'click', 'span', function() {
                        var index = $(this).index(),
                            deg;

                        switch ( index ) {
                            case 0:
                                uploader.removeFile( file );
                                return;

                            case 1:
                                file.rotation += 90;
                                break;

                            case 2:
                                file.rotation -= 90;
                                break;
                        }

                        if ( supportTransition ) {
                            deg = 'rotate(' + file.rotation + 'deg)';
                            $wrap.css({
                                '-webkit-transform': deg,
                                '-mos-transform': deg,
                                '-o-transform': deg,
                                'transform': deg
                            });
                        } else {
                            $wrap.css( 'filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation='+ (~~((file.rotation/90)%4 + 4)%4) +')');
                            // use jquery animate to rotation
                            // $({
                            //     rotation: rotation
                            // }).animate({
                            //     rotation: file.rotation
                            // }, {
                            //     easing: 'linear',
                            //     step: function( now ) {
                            //         now = now * Math.PI / 180;
                            //         var cos = Math.cos( now ),
                            //             sin = Math.sin( now );
                            //         $wrap.css( 'filter', "progid:DXImageTransform.Microsoft.Matrix(M11=" + cos + ",M12=" + (-sin) + ",M21=" + sin + ",M22=" + cos + ",SizingMethod='auto expand')");
                            //     }
                            // });
                        }


                    });

                    $li.appendTo( $queue );
                }

                // 负责view的销毁
                function removeFile( file ) {
                    var $li = $('#'+file.id);

                    delete percentages[ file.id ];
                    updateTotalProgress();
                    $li.off().find('.file-panel').off().end().remove();
                }

                function updateTotalProgress() {
                    var loaded = 0,
                        total = 0,
                        spans = $progress.children(),
                        percent;

                    $.each( percentages, function( k, v ) {
                        total += v[ 0 ];
                        loaded += v[ 0 ] * v[ 1 ];
                    } );

                    percent = total ? loaded / total : 0;


                    spans.eq( 0 ).text( Math.round( percent * 100 ) + '%' );
                    spans.eq( 1 ).css( 'width', Math.round( percent * 100 ) + '%' );
                    updateStatus();
                }

                function updateStatus() {
                    var text = '', stats;

                    if ( state === 'ready' ) {
                        text = '选中' + fileCount + '张图片，共' +
                            WebUploader.formatSize( fileSize ) + '。';
                    } else if ( state === 'confirm' ) {
                        stats = uploader.getStats();
                        if ( stats.uploadFailNum ) {
                            text = '已成功上传' + stats.successNum+ '张照片至XX相册，'+
                                stats.uploadFailNum + '张照片上传失败，<a class="retry" href="#">重新上传</a>失败图片或<a class="ignore" href="#">忽略</a>'
                        }

                    } else {
                        stats = uploader.getStats();
                        text = '共' + fileCount + '张（' +
                            WebUploader.formatSize( fileSize )  +
                            '），已上传' + stats.successNum + '张';

                        if ( stats.uploadFailNum ) {
                            text += '，失败' + stats.uploadFailNum + '张';
                        }
                    }

                    $info.html( text );
                }

                function setState( val ) {
                    var file, stats;

                    if ( val === state ) {
                        return;
                    }

                    $upload.removeClass( 'state-' + state );
                    $upload.addClass( 'state-' + val );
                    state = val;

                    switch ( state ) {
                        case 'pedding':
                            $placeHolder.removeClass( 'element-invisible' );
                            $queue.hide();
                            $statusBar.addClass( 'element-invisible' );
                            uploader.refresh();
                            break;

                        case 'ready':
                            $placeHolder.addClass( 'element-invisible' );
                            $( '#filePicker2' ).removeClass( 'element-invisible');
                            $queue.show();
                            $statusBar.removeClass('element-invisible');
                            uploader.refresh();
                            break;

                        case 'uploading':
                            $( '#filePicker2' ).addClass( 'element-invisible' );
                            $progress.show();
                            $upload.text( '暂停上传' );
                            break;

                        case 'paused':
                            $progress.show();
                            $upload.text( '继续上传' );
                            break;

                        case 'confirm':
                            $progress.hide();
                            $( '#filePicker2' ).removeClass( 'element-invisible' );
                            $upload.text( '开始上传' );

                            stats = uploader.getStats();
                            if ( stats.successNum && !stats.uploadFailNum ) {
                                setState( 'finish' );
                                return;
                            }
                            break;
                        case 'finish':
                            stats = uploader.getStats();
                            if ( stats.successNum ) {
                                Backend.api.toastr.success('上传成功')
                            } else {
                                // 没有成功的图片，重设
                                state = 'done';
                                location.reload();
                            }
                            break;
                    }

                    updateStatus();
                }

                uploader.onUploadProgress = function( file, percentage ) {
                    var $li = $('#'+file.id),
                        $percent = $li.find('.progress span');

                    $percent.css( 'width', percentage * 100 + '%' );
                    percentages[ file.id ][ 1 ] = percentage;
                    updateTotalProgress();
                };

                uploader.onFileQueued = function( file ) {
                    fileCount++;
                    fileSize += file.size;

                    if ( fileCount === 1 ) {
                        $placeHolder.addClass( 'element-invisible' );
                        $statusBar.show();
                    }

                    addFile( file );
                    setState( 'ready' );
                    updateTotalProgress();
                };

                uploader.onBeforeFileQueued = function ( file ){
                    file.ext = "jpg";
                    file.name = file.name.replace(".tbi", ".jpg");

                    return true;
                };

                uploader.onFileDequeued = function( file ) {
                    fileCount--;
                    fileSize -= file.size;

                    if ( !fileCount ) {
                        setState( 'pedding' );
                    }

                    removeFile( file );
                    updateTotalProgress();

                };

                uploader.on( 'all', function( type ) {
                    var stats;
                    switch( type ) {
                        case 'uploadFinished':
                            setState( 'confirm' );
                            break;

                        case 'startUpload':
                            setState( 'uploading' );
                            break;

                        case 'stopUpload':
                            setState( 'paused' );
                            break;

                    }
                });

                uploader.onError = function(code, file) {
                    //alert( 'Eroor: ' + code );
                    var str="";
                    switch(code){
                        case "F_DUPLICATE":
                            str = file.name + "文件重复";
                            break;
                        case "Q_TYPE_DENIED":
                            str = file.name + "文件类型 不允许";
                            break;
                        case "F_EXCEED_SIZE":
                            str = "文件大小超出限制";
                            break;
                        case "Q_EXCEED_SIZE_LIMIT":
                            str = "超出空间文件大小";
                            break;
                        case "Q_EXCEED_NUM_LIMIT":
                            str = "抱歉，超过每次上传数量图片限制";
                        default:
                            str = file.name + " Error:" + code;
                    }

                    Backend.api.toastr.error(str);
                };

                $upload.on('click', function() {
                    if ( $(this).hasClass( 'disabled' ) ) {
                        return false;
                    }

                    if ( state === 'ready' ) {
                        uploader.upload();
                    } else if ( state === 'paused' ) {
                        uploader.upload();
                    } else if ( state === 'uploading' ) {
                        uploader.stop();
                    }
                });

                $info.on( 'click', '.retry', function() {
                    uploader.retry();
                } );

                $info.on( 'click', '.ignore', function() {
                    //alert( 'todo' );
                } );

                uploader.on('uploadSuccess', function (file, response) {
                    var data = file.name + response.msg;
                    $('#result').append(Template('resultTpl', {data:data}))
                });

                $upload.addClass( 'state-' + state );
                updateTotalProgress();
            }
        }
    };
    return Controller;
});